import React, { PureComponent } from 'react';
import { Table, Alert, Badge, Divider } from 'antd';
import styles from './StandardTable.less';

class StandardTable extends PureComponent {
  handleTableChange = (pagination, filters, sorter) => {
    this.props.onChange(pagination, filters, sorter);
  }

  render() {
    const { data: { data, pagination }, loading } = this.props;

    const columns = [
      {
        title: '学员ID',
        dataIndex: 'id',
      },
      {
        title: '学员姓名',
        dataIndex: 'name',
      },
      {
        title: '身份证',
        dataIndex: 'idcard',
      },
      {
        title: '密码',
        dataIndex: 'password',
      },
      {
        title: '状态',
        dataIndex: 'status',
        render: (text) => {
          const statusObj = {
            'todo': '未参加考试',
            'doing': '考试中',
            'done': '考试完成'
          };
          return (
            <span>{statusObj[text]}</span>
          )
        }
      },
      {
        title: '最终成绩',
        dataIndex: 'score',
      },
      {
        title: '操作',
        dataIndex: 'id',
        render: (text) => {
          return (
            <span>
              <a href={'/student/paper?id=' + text} target='_blank'>查看试卷</a> |
              <a href={'/student/reset?id=' + text} target='_blank'>信息重制</a>
            </span>
          )
        }
      },
    ];

    const paginationProps = {
      showSizeChanger: true,
      showQuickJumper: true,
      ...pagination,
    };

    return (
      <div className={styles.standardTable}>
        <Table
          loading={loading}
          rowKey={record => record.id}
          dataSource={data}
          columns={columns}
          pagination={paginationProps}
          onChange={this.handleTableChange}
        />
      </div>
    );
  }
}

export default StandardTable;
